<template>
	<view class="page">
		<view class="fragment-wrap">
			<view class="fragment-item">
				<view class="title">基本信息</view>
				<view class="info-wrap">
					<view class="info-item flex">
						<view class="key">用户编码</view>
						<view class="val">{{cusInfo.usn || '-'}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">用户昵称</view>
						<view class="val">{{cusInfo.nickname || '-'}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">手机号码</view>
						<view class="val">{{cusInfo.mobile || '-'}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">客户来源</view>
						<view class="val">{{cusInfo.cus_from || '-'}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">注册日期</view>
						<view class="val">{{cusInfo.register_date || '-'}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">最后登录</view>
						<view class="val">{{cusInfo.last_time || '-'}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">最后跟进</view>
						<view class="val">{{cusInfo.last_processon_time || '-'}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">备注信息</view>
						<view class="val">{{cusInfo.remark || '-'}}</view>
					</view>
				</view>
			</view>
			
			<view class="fragment-item">
				<view class="title">实名认证</view>
				<view class="info-wrap">
					<view class="info-item flex">
						<view class="key">是否实名</view>
						<view class="val">{{cusInfo.is_idcheck>0?'是':'否'}}</view>
					</view>
					<view class="info-item flex">
						<view class="key">真实姓名</view>
						<view class="val">{{cusInfo.realname || '-'}}</view>
					</view>
					<view class="info-item flex">
						<view class="key">身份证号</view>
						<view class="val">{{cusInfo.idnumber || '-'}}</view>
					</view>
					<view class="info-item flex">
						<view class="key">证件地址</view>
						<view class="val">{{cusInfo.address || '-'}}</view>
					</view>
					<view class="info-item flex">
						<view class="key">认证时间</view>
						<view class="val">{{cusInfo.check_time || '-'}}</view>
					</view>
				</view>
			</view>
			
			<view class="fragment-item">
				<view class="title">旅游偏好</view>
				<view class="info-wrap">
					<view class="info-item flex">
						<view class="key">出游喜好</view>
						<view class="val">{{cusInfo.tour_perfer || '-'}}</view>
					</view>
					<view class="info-item flex">
						<view class="key">意向景点</view>
						<view class="val">{{cusInfo.tour_target || '-'}}</view>
					</view>
					<view class="info-item flex">
						<view class="key">去过哪里</view>
						<view class="val">{{cusInfo.wheregone || '-'}}</view>
					</view>
				</view>
			</view>
			
			<view class="fragment-item">
				<view class="title">订单消费</view>
				<view class="info-wrap">
					<view class="info-item flex">
						<view class="key">消费次数</view>
						<view class="val">{{cusInfo.order_nums}}</view>
					</view>
					
					<view class="info-item flex">
						<view class="key">消费金额</view>
						<view class="val">{{cusInfo.order_amt}}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { customerInfo } from '@/api/api.js'
	export default {
		data() {
			return {
				cusUid: 0,
				cusInfo: {
					uid: 0,
					usn: '',
					full_name: '',
					nickname: '',
					mobile: '',
					tour_perfer: '',
					cus_from: '',
					wheregone: '',
					tour_target: '',
					remark: '',
					register_date: '',
					last_time: '',
					birthday: '',
					last_processon_time: '',
					is_idcheck: 0,
					realname: '',
					idnumber: '',
					address: '',
					check_time: '',
					order_nums: 0,
					order_amt: 0
				}
				
			}
		},
		onLoad(options) {
			this.cusUid = options.cusUid || 0
		},
		methods:{
			getCustomerInfo() {
				uni.showLoading({
					title: '加载中'
				})
				customerInfo(this.cusUid).then(res => {
					this.cusInfo = res.data || {}
				}).finally(_ => {
					uni.hideLoading()
				})
			}
		},
		mounted() {
			this.getCustomerInfo()
		},
		/**
		 * 下拉刷新回调函数
		 */
		onPullDownRefresh() {
			this.getCustomerInfo()
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f2f2f2!important;
	}
	.page {
		padding: 30rpx;
		font-size: 26rpx;
		.fragment-wrap {
			.fragment-item {
				padding: 30rpx;
				border-radius: 20rpx;
				background-color: #fff;
				margin-bottom: 30rpx;
				.title {
					padding: 8rpx 0rpx 20rpx 0;
					font-weight: bold;
					border-bottom: 1rpx solid #ccc;
				}
				.info-wrap {
					padding-top: 20rpx;
					.info-item {
						margin-bottom: 20rpx;
						align-items: center;
						.key {
							width: 120rpx;
						}
						.val {
							flex: 1;
						}
					}
				}
			}
		}
	}
</style>
